<div id="pgea">
        <div class="row" style="margin: 10px">
                <!-- <table border="1" cellspacing="0" width="50%" height="150">
                <caption>纵向合并单元格</caption>
                <tr>
                        <th>班级</t>
                        <th>姓名</th>
                        <th>年龄</th>
                        <th>电话</th>
                </tr>
                <tr>
                        <td rowspan="2">601班</td>
                        <td>Jack</td>
                        <td>24</td>
                        <td>1351234567</td>
                </tr>
                <tr>
                        <td>Tom</td>
                        <td>22</td>
                        <td>1351234567</td>
                </tr>
               rowspan中必须指定要合并的列数目，是两行还是三行等等
                <tr>
                        <td rowspan="3">602班</td>
                        <td>Rose</td>
                        <td>22</td>
                        <td>1351234567</td>
                </tr>
                <tr>
                        <td>张三</td>
                        <td>25</td>
                        <td>1351234567</td>
                </tr>
                <tr>
                        <td>李四</td>
                        <td>25</td>
                        <td>1351234567</td>
                </tr>
        </table>-->
                <button id="btn_gen" class="btn btn-info" @click="tableTest">生成电源板FMEA</button>
                <button id="btn_export" class="btn btn-info disabled " disabled  @click="exportTest">导出报表</button>
        </div>
        <hr>
        <div id="tabView" class="row" style="margin: 10px">

        </div>

        <div class="layui-tab" lay-filter="demo" lay-allowclose="true">
                <ul class="layui-tab-title">

                </ul>
                <div class="layui-tab-content">

                </div>
        </div>


</div>

<script>
        var FileSaver = require('file-saver');
        var XLSX = require("./js/dist/xlsx.core.min.js");
        layui.use('element', function () {
                var $ = layui.jquery
                        , element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
        });

        var vm_ea = new Vue({
                el: "#pgea",
                data: {
                        tok:false  //是否已经生成报表的tok，防止还没有生成就导出出现错误
                },
                methods: {
                        exportTest: function () {

                                //doit(document.getElementById('data-table1'), "xlsx");
                                /* create new workbook */
                                var workbook = XLSX.utils.book_new();

                                /* convert table 'table1' to worksheet named "Sheet1" */
                                var ws1 = XLSX.utils.table_to_sheet(document.getElementById('data-table1'));
                                XLSX.utils.book_append_sheet(workbook, ws1, "电源板EA");

                                /* convert table 'table2' to worksheet named "Sheet2" */
                                var ws2 = XLSX.utils.table_to_sheet(document.getElementById('data-table2'));
                                XLSX.utils.book_append_sheet(workbook, ws2, "功能电路EA");

                                //as well as 3
                                var ws3 = XLSX.utils.table_to_sheet(document.getElementById('data-table3'));
                                XLSX.utils.book_append_sheet(workbook, ws3, "元器件EA");

                                //将生成好的excel文件弹出对话框提供给用户下载
                                /* bookType can be any supported output type */

                                var wopts = { bookType: 'xlsx', bookSST: false, type: 'array' };

                                var wbout = XLSX.write(workbook, wopts);

                                /* the saveAs call downloads a file on the local machine */
                                saveAs(new Blob([wbout], { type: "application/octet-stream" }), "可靠性报表.xlsx");

                        },
                        tableTest: function () {

                                element = layui.element
                                /*
                                        在点击按钮的时候先启动前程计算CA，然后可以顺便传送到后台去生成表格
                                */
                                if (typeof (w4) == "undefined") {//启动JS线程计算，避免卡死主页面 
                                        console.log("start CA")
                                        w4 = new Worker("js/cal_ca.js")//在线程中计算CA的相关数值

                                        //eval(_System["电源板"])._Item = _Item//更新了电源板的元器件 
                                        w4.postMessage(eval(_System["电源板"]));

                                        console.log("正在计算CA")
                                        w4.onmessage = function (event) {
                                                console.log("CA计算结束,开始生成表格");
                                                console.log(event.data);
                                                systemCaled = event.data;
                                                if (typeof (w1) == "undefined") {//启动JS线程计算，避免卡死主页面 
                                                        console.log("start")
                                                        w1 = new Worker("js/fmeca_page1.js")//在线程中计算FMEA表格


                                                        //修改与2019/5/11  在前端页面建立了指针关系，重新计算FEMCA表格
                                                        //eval(_System["电源板"])._Item = _Item//更新了电源板的元器件 
                                                        w1.postMessage(systemCaled)

                                                        console.log("正在计算")
                                                        w1.onmessage = function (event) {
                                                                //console.log("后台数据：", event.data)
                                                                //$("#tabView").html(event.data)
                                                                element = layui.element
                                                                element.tabAdd('demo', {
                                                                        title: '电源板EA' //用于演示
                                                                        , content: event.data
                                                                        , id: 1 //实际使用一般是规定好的id，这里以时间戳模拟下
                                                                })
                                                        }
                                                }
                                                if (typeof (w2) == "undefined") {//启动JS线程计算，避免卡死主页面 
                                                        console.log("start")
                                                        w2 = new Worker("js/fmeca_page2.js")//在线程中计算FMEA表格


                                                        //修改与2019/5/11  在前端页面建立了指针关系，重新计算FEMCA表格
                                                        //eval(_System["电源板"])._Item = _Item//更新了电源板的元器件 
                                                        w2.postMessage(systemCaled)

                                                        console.log("正在计算")
                                                        w2.onmessage = function (event) {
                                                                //console.log("后台数据：", event.data)
                                                                //$("#tabView").html(event.data)
                                                                element = layui.element
                                                                element.tabAdd('demo', {
                                                                        title: '功能电路EA' //用于演示
                                                                        , content: event.data
                                                                        , id: 2 //实际使用一般是规定好的id，这里以时间戳模拟下
                                                                })
                                                        }
                                                }
                                                if (typeof (w3) == "undefined") {//启动JS线程计算，避免卡死主页面 
                                                        console.log("start")
                                                        w3 = new Worker("js/fmeca_page3.js")//在线程中计算FMEA表格


                                                        //修改与2019/5/11  在前端页面建立了指针关系，重新计算FEMCA表格
                                                        //eval(_System["电源板"])._Item = _Item//更新了电源板的元器件 
                                                        w3.postMessage(systemCaled)

                                                        console.log("正在计算")
                                                        w3.onmessage = function (event) {
                                                                //console.log("后台数据：", event.data)
                                                                //$("#tabView").html(event.data)
                                                                element = layui.element
                                                                element.tabAdd('demo', {
                                                                        title: '元器件EA' //用于演示
                                                                        , content: event.data
                                                                        , id: 3//实际使用一般是规定好的id，这里以时间戳模拟下
                                                                })
                                                        }
                                                }
                                                
                                        }
                                }
                                //计算CA
                                element.tabChange('demo', '1') //默认打开第一个页面
                                $('#btn_export').attr("disabled",false);
                                $('#btn_export').removeClass("disabled");
                                $('#btn_gen').addClass("disabled");
                                $('#btn_gen').attr("disabled",true);//操作按钮的属性，使其禁用，防止误操作 
                        },
                }
        })


</script>